import React from 'react';
import { Carousel } from 'antd';
import { WeaTools, WeaTab } from 'ecCom';

import './style/';

class View extends React.Component {
    constructor(props) {
        super(props);
        this.state = { data: [], selectedKey: 0 };
    }

    componentWillMount() {
        const { params = {} } = this.props;
        const { eid } = params;
        WeaTools.callApi('/api/crm/enterprise/getElementSettingList', 'GET', { ...params, getLinks: 1 }).then(result => {
            this.setState({ data: result.data });
        })
    }

    render() {
        const { data, selectedKey } = this.state;

        return (
            <div className="portal-demo-element-view">
                <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@f5hsh2`}
                    datas={data}
                    keyParam="viewcondition" //主键
                    selectedKey={this.state.selectedKey}
                    onChange={v => { setTimeout(() => { this.setState({ selectedKey: v }) }, 500); }}
                />
                {data.map(item => {
                    const { linkurl, viewcondition } = item
                    if (viewcondition == selectedKey) {
                        return <iframe ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@f5hscd@${selectedKey}`} frameborder="0" src={linkurl} style={{ border: "none", flex: "1 1", display: "block" }}></iframe>
                    }
                })}
            </div>
        );
    }
}

export default View;
